import React, { useEffect, useState } from "react";
import { Tabs, Table, Button } from 'antd';
import { Header } from "antd/lib/layout/layout";
import request from "../../../utils/request";
import { connect } from "react-redux";
const onChange = (key) => {
  // console.log(key);
};
const columns = [
  {
    title: '类型',
    dataIndex: 'videoClass',
  },
  {
    title: '编号',
    dataIndex: 'movieID',
  },
  {
    title: '电影名字',
    dataIndex: 'movieName',
  },


];
const data = [
  {
    key: '1',
    name: '动作',
    age: 32,
    address: '',
  },

];
function Favs({ user }) {
  // console.log(props);
  const [data, setData] = useState([])
  const id = user.userInfo.id
  // console.log(id);
  useEffect(() => {
    request({
      url: '/user/getfavs',
      params: {
        id
      }
    }).then(res => {
      // console.log(res.data.moviedata.data);
      const newdata = res.data.moviedata.data
      const zhendata = newdata.map((item, idx) => {
        let obj = {
          videoClass: item.videoClass,
          movieName: item.title,
          movieID: item.movieID

        }
        return obj
      })
      setData(zhendata)
    })
  }, [])

  return (
    <>
      <Tabs
        defaultActiveKey="1"
        onChange={onChange}

        items={[
          {
            label: `我的收藏`,
            key: '1',
            children: ``,
          }
        ]}

      >
      </Tabs>
      <span style={
        {
          position: 'absolute',
          top: '10px',
          right: '20px'

        }
      }><Button>清空收藏</Button></span>
      <Table columns={columns} dataSource={data} />
    </>

  )
}

const mapStateToProps = function (state) {
  // console.log(state);
  return {
    user: state
  }
}

// 把修改redux的方法映射到props
const mapDispatchToProps = function (dispatch) {
  return {
  }
}
Favs = connect(mapStateToProps, mapDispatchToProps)(Favs)
export default Favs